#search {
  position: relative;
}
#search input{
  font-family:Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Noto Sans CJK SC, WenQuanYi Micro Hei, Arial, sans-serif
}
#search article{
  background-color: #eeeeee;
  position: absolute;
  z-index: 3;
  height: 800px;
  width:100%;
  overflow: hidden;
  padding-top: 30px;
  opacity:0.99;
  display: none;
}
#search article h3{
  text-align: center;
}
#search article .tag{
  margin:20px 0;
}
#search article .tag span{
  font-size: 14px;
  text-align: center;
  width:33%;
  display: inline-block;
  box-sizing: border-box;
  color: #09bb07;
  border-right:1px solid rgba(220,220,220,0.67);
  margin-bottom: 15px;
}
#search article .tag span:nth-child(3n){
  border-right:transparent;
}
#search article .weui-cells{
  background-color:transparent;
  width:85%;
  margin:0 auto;
}
#search article .weui-cells .weui-cell{
  padding:15px;
}
#search article .weui-cells .weui-cell__hd img{
  width:16px;
}
#search article .weui-cells .weui-cell__bd{
  font-style: 13px;
  color: #999999;
}
#search .weui-search-bar__label{
  line-height: 1.8;
}
#search .search-open {
  z-index:10;
  height:100%;
  width:100%;
  -webkit-transition: 0.3s;
  transition:0.3s;
}
#search.search-open article{display:block}

#search .weui-search-bar__label{
  -webkit-transition:0.3s;
  transition:0.3s
}
#search .weui-search-bar_focusing .weui-search-bar__label{
  display:block;
  -webkit-transform:translate3d(-100%, 0, 0);
  transform:translate3d(-100%, 0, 0);
  opacity:0.0
}
